<template>
	<view class="content">
		<view class="company_image">
		</view>
		<view class="contact">
			<view class="contact-card">
				<view class="icon">
					<image src="/static/icons/company.svg"></image>
				</view>
				<view class="text">
					<view>Company</view>
					<view>大连施奈莱克创新汽车零部件有限公司</view>
				</view>
			</view>
			<view class="contact-card">
				<view class="icon">
					<image src="/static/icons/photo.svg"></image>
				</view>
				<view class="text">
					<view>Phone</view>
					<view>0411- 4567- 8901</view>
				</view>
			</view>
			<view class="contact-card">
				<view class="icon">
					<image src="/static/icons/email.svg"></image>
				</view>
				<view class="text">
					<view>Email</view>
					<view>example@example.com</view>
				</view>
			</view>
			<view class="contact-card">
				<view class="icon">
					<image src="/static/icons/address.svg"></image>
				</view>
				<view class="text">
					<view>Address</view>
					<view>辽宁省大连经济技术开发区湾达路3-8号四层409办公室</view>
				</view>
			</view>
		</view>
		<web-view src="http://192.168.3.190:3000/#/iframePrint" allow @error="handleError"
			@load="loadingSuccess"></web-view>
	</view>
</template>

<script setup lang="ts">
function handleError(e) {
	uni.showToast({
		title: e
	})
}
function loadingSuccess() {
	uni.showToast({
		title: '成功'
	})
}
</script>

<style lang="scss" scoped>
uni-page-body {
	height: 100%;
	background-color: #f9f9fc;
}

.content {
	width: 100%;
	height: 100%;

	// padding: $uni-page-padding;
	.contact {
		padding: $uni-page-padding;
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.contact-card {
		display: flex;
		align-items: flex-start;
		margin-bottom: 19px;

		.icon {
			margin-right: 15px;
			width: 40px;
			height: 40px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 24px;
				height: 24px;
			}
		}

		.text {
			flex-basis: calc(100% - 55px);

			view:nth-child(1) {
				font-size: 16px;
				margin-bottom: 3px;
				line-height: 1.5;
			}

			view:nth-child(1) {
				font-size: 16px;
				margin-bottom: 3px;
				line-height: 1.5;
				font-weight: 500;
			}

			view:nth-child(2) {
				font-size: 14px;
				line-height: 1.5;
				color: #7e7e7e;
			}
		}
	}

	.company_image {
		width: 100%;
		height: 230rpx;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		background-image: url(/static/image/personal/company.png);
	}
}
</style>
